<template>
	<view class="cart-tool">
		<view class="tool-selectAll">
			<checkbox-group v-if='showAllCheck' @change="changAllCheck">
				<label>
					<checkbox color=" #ddaacc" :checked="allChecked" />
					<text>全选</text>
				</label>
			</checkbox-group>
		</view>

		<view class="total-price-box">
			<view class="total-price">合计：<text class="price-text">￥{{totalPrice}}</text></view>
			<view class="runway-text">包含运费</view>
		</view>

		<view class="settle">
			<text @tap='handleClick'>{{buttonText}}({{totalSum}})</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: "hjx-switch",
		data() {
			return {

			}
		},
		props: {
			cartData: {
				type: Array,
				default: []
			},
			// 是否显示复选框
			buttonText: {
				type: String,
				default: '结算'
			},
			// 是否显示全选框
			showAllCheck: {
				type: Boolean,
				default: false
			},
		},
		methods: {
			changAllCheck() {
				this.$emit('changAllCheck', !this.allChecked)
			},

			// 结算/支付
			async handleClick() {
				if (this.buttonText == '结算') {
					const address = uni.getStorageSync('address');
					// 1.判断是否存在收货地址
					if (!address.userName) {
						uni.showToast({
							title: "您还没有选择收货地址！",
							icon: 'none'
						});
						return;
					}
					// 2.判断是否选中商品
					if (this.totalSum == 0) {
						uni.showToast({
							title: "您还没有选中商品！",
							icon: 'none'
						});
						return;
					}
					uni.navigateTo({
						url: '../../subpkg2/pay/pay'
					});

				} else if (this.buttonText == '支付') {
					try {
						// 1.判断是否存在token地址
						const token = uni.getStorageSync('token');
						// 2.没有token，跳转到登录页面
						if (!token) {
							// 在缓存记录跳转到登录页前的页面是pay支付页面
							uni.setStorageSync('page', 'pay');
							uni.navigateTo({
								url: '../../subpkg2/login/login'
							})
						}
						return;

						// 如果支付成功，弹出提示
						uni.showToast({
							title: '支付成功',
							icon: 'none'
						});
						console.log('支付成功');

						// 将支付成功的商品从购物车中移除
						const buy = uni.getStorageSync('buy') || {};
						if (buy.goods_id) {
							// 从立即购买下的订单
							uni.removeStorageSync('buy');
						} else {
							let cart = uni.getStorageSync('cart') || [];
							cart = cart.filter(v => !n.checked);
							uni.setStorageSync('cart', cart);
						}

						// 跳到订单页面
						uni.reLaunch({
							url: '../../subpkg2/order/order'
						})
					} catch (e) {
						uni.showToast({
							title: '支付失败',
							icon: 'none'
						});
						//TODO handle the exception
					}
				}
			}
		},
		computed: {
			// 根据所有产品的选中状态(true或 false)计算出全选按钮的选中状态
			allChecked() {
				// every()方法用于检测数组所有元素是否都符合指定条件
				return this.cartData.every(v => v.checked)
			},
			// 价格总计
			totalPrice() {
				let sum = 0;
				this.cartData.forEach(v => {
					if (v.checked) {
						sum += v.cartNum * v.goods_price
					}
				})
				return sum;
			},
			// 结算
			totalSum() {
				let num = 0;
				this.cartData.forEach(v => {
					if (v.checked) {
						num += v.cartNum
					}
				})
				return num;
			},
		}
	}
</script>

<style lang="scss">
	.cart-tool {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50px;
		padding-left: 15rpx;
		background-color: #fff;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;

		.total-price-box {
			.price-text {
				color: #ddaacc;
				font-weight: bold;
			}

			.total-price {
				font-size: 16px;
			}

			.runway-text {
				color: #818181;
				font-size: 12px;
			}
		}

		.settle {
			background-color: #c00000;
			height: 50px;
			color: #f8f8f8;
			line-height: 50px;
			padding: 0 10px;
			min-width: 100px;
			text-align: center;
		}
	}
</style>